<template>
  <el-container style="height: 100vh; width: 100vw;">
    <el-header>我的主页</el-header>
    <el-container>
      <el-aside width="250px"><LeftMenu /></el-aside>
      <el-main v-for="(item, index) in cardContents" :key="index">
        <CardContent :card_name="item.card_name" :card_url= "item.card_url" :card_user= "item.card_user" :card_password= "item.card_password" :card_desc= "item.card_desc"/>
      </el-main>
    </el-container>
  </el-container>
</template>
 
<script setup>
import { ElContainer, ElHeader, ElAside, ElMain } from 'element-plus';
import LeftMenu from  '@/components/LeftMenu.vue'
import CardContent from '@/components/CardContent.vue'
// 定义一个卡片内容的数组
const cardContents = [
  { card_name: "禅道" , card_url:"http://zentao.mbse.local/zentao/my.html", card_user:"gaowj", card_password:"gaowj123", card_desc:"Bug管理"},
  { card_name: "Jenkins" , card_url:"http://jenkins-win.mbse.local:8080/", card_user:"gaowj", card_password:"123456", card_desc:"打包管理"},
  { card_name: "飞书" , card_url:"https://eq7m6neb2i.feishu.cn/wiki/B2xIwnU3Kisiv1kKjIXcI4YvnBp", card_user:"gaowj", card_password:"123456", card_desc:"飞书个人主页"},
  { card_name: "Gitee" , card_url:"https://gitee.com/gwjxiao", card_user:"gaowj", card_password:"123456", card_desc:"代码库管理"},
  { card_name: "Jenkins_Win" , card_url:"http://localhost:8080/", card_user:"gaowj", card_password:"123456", card_desc:"自己的打包"},
  { card_name: "ElementPlus" , card_url:"https://element-plus.youqua.cn/zh-CN/component/overview.html", card_user:"gaowj", card_password:"123456", card_desc:"自己的打包"},
  // 如果需要更多，可以继续添加
];
</script>

<style scoped>
.el-header {
  background-color: #b3c0d1;
  color: var(--el-text-color-primary);
  text-align: center;
  line-height: 60px;
}
，el-footer{
  background-color: #026efa;
  color: var(--el-text-color-primary);
  text-align: center;
  line-height: 60px;
}
 
.el-aside {
  background-color: #d3dce6;
  color: var(--el-text-color-primary);
}
 
.el-main {
  background-color: #e9eef3;
  color: var(--el-text-color-primary);
}


</style>